<template>
  <div class="cadre-com-leader-box">
    <div class="page-header">
      <div class="select-box">
        <el-select v-model="orgId">
          <el-option v-for="item in policeOptions" :key="item.id" :value="item.id" :label="item.label"></el-option>
        </el-select>
      </div>
      <div class="btn-box">
        <!-- <el-dropdown>
          <el-button type="primary">
            模版<i class="el-icon-arrow-down el-icon--right"></i>
          </el-button>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item>黄金糕</el-dropdown-item>
            <el-dropdown-item>狮子头</el-dropdown-item>
            <el-dropdown-item>螺蛳粉</el-dropdown-item>
            <el-dropdown-item>双皮奶</el-dropdown-item>
            <el-dropdown-item>蚵仔煎</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown> -->

        <el-button type="primary" @click="batcLineDownVisibile = true">批量下载</el-button>
        <template v-if="timeType === '0'">
          <el-button @click="isEdit = true" v-if="isEdit === false" type="primary">编辑</el-button>
          <el-button v-if="isEdit" @click="cancelEdit">取消</el-button>
          <el-button v-if="isEdit" @click="submitForm" :loading="loading" type="primary">提交</el-button>
        </template>
      </div>
    </div>
    <el-form :model="leaderForm" label-width="10" size="small" ref="leader-ref-form">
      <el-row :gutter="20" class="con-box">
        <el-col :span="4" class="time-line-box">
          <!-- <div style="min-width: 200px;min-height: 200px;"> -->
          <el-timeline>
            <el-timeline-item v-for="(activity, index) in activities" :key="index" :type="activity.type">
              <div @click="changeTimeItem(activity, index)" style="cursor: pointer;font-size: 16px;">
                <div v-if="index === 0">{{activity.content}}</div>
                <div v-if="index !== 0" style="font-size: 14px;">{{activity.submissionTime }}</div>
              </div>
            </el-timeline-item>
          </el-timeline>
          <!-- </div> -->
        </el-col>
        <el-col :span="13" class="content-list-box">
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>领导小组</span>
              <el-button style="float: right;" type="primary" v-if="isEdit" icon="el-icon-plus" size="mini"
                @click="addLeaderItem('leader')">新增</el-button>
            </div>
            <el-table :data="leaderForm.szLeaderGroupList" height="332">
              <el-table-column label="职位">
                <template slot-scope="scope">
                  <el-form-item v-if="isEdit" :prop="`szLeaderGroupList.${scope.$index}.position`"
                    :rules="[{ required: true, message: '请选择职位', trigger: 'change' }]">
                    <el-select v-model="scope.row.position">
                      <el-option v-for="v in $store.state.distObj.sz_leader_job" :key="v.value" :value="v.value"
                        :label="v.label"></el-option>
                    </el-select>
                  </el-form-item>
                  <template v-else>{{ getValueContent($store.state.distObj.sz_leader_job, scope.row.position)
                    }}</template>
                </template>
              </el-table-column>
              <el-table-column label="姓名" prop="name">
                <template slot-scope="scope">
                  <el-form-item v-if="isEdit" :prop="`szLeaderGroupList.${scope.$index}.name`"
                    :rules="[{ required: true, message: '请选择姓名', trigger: 'change' }]">
                    <el-select v-model="scope.row.name" filterable>
                      <el-option v-for="v in organUserOptions" :key="v.objuid" :value="v.objuid"
                        :label="v.userName"></el-option>
                    </el-select>
                  </el-form-item>
                  <template v-else>{{ getValueContent(organUserOptions, scope.row.name, { value: 'objuid', label:
                    'userName'}) }}</template>
                </template>
              </el-table-column>
              <el-table-column label="职务" prop="title">
                <template slot-scope="scope">
                  <el-form-item v-if="isEdit" :prop="`szLeaderGroupList.${scope.$index}.title`"
                    :rules="[{ required: true, message: '请选择职务', trigger: 'change' }]">
                    <el-select v-model="scope.row.title">
                      <el-option v-for="v in $store.state.distObj.sz_leader_position" :key="v.value" :label="v.label"
                        :value="v.value"></el-option>
                    </el-select>
                  </el-form-item>
                  <template v-else>{{ getValueContent($store.state.distObj.sz_leader_position, scope.row.title)
                    }}</template>
                </template>
              </el-table-column>
              <el-table-column label="操作" v-if="isEdit" width="60">
                <template slot-scope="scope">
                  <el-button type="text"
                    @click="deleteLeaderItem(leaderForm.szLeaderGroupList, scope.$index)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-card>
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span style="padding-right: 20px;">密码办成员</span>
              <span>密码管理责任部门：
                <el-form-item v-if="isEdit" prop="subDepartment"
                  :rules="[{ required: true, message: '请选择密码管理责任部门', trigger: 'change' }]"
                  style="display: inline-block;margin-bottom: 0;">
                  <!-- <el-select v-model="leaderForm.subDepartment">
                    <el-option v-for="item in passwordOptions" :key="item.orgId" :value="item.orgId"
                      :label="item.label"></el-option>
                  </el-select> -->
                  <el-cascader :options="$store.state.passwordOptions" :props="{'value': 'orgId', 'label': 'label'}"
                    v-model="leaderForm.subDepartment"></el-cascader>
                </el-form-item>
                <!-- <template v-else>{{ getValueContent(passwordOptions, leaderForm.subDepartment, { value: 'orgId', label: 'label'}) }}</template> -->
                <template v-else>{{ leaderForm.subDepartmentName}}</template>
              </span>
              <el-button style="float: right;" type="primary" v-if="isEdit" icon="el-icon-plus" size="mini"
                @click="addLeaderItem()">新增</el-button>
            </div>
            <el-table :data="leaderForm.szPwLeaderGroupList" height="332">
              <el-table-column label="职位" prop="position">
                <template slot-scope="scope">
                  <el-form-item v-if="isEdit" :prop="`szPwLeaderGroupList.${scope.$index}.position`"
                    :rules="[{ required: true, message: '请选择职位', trigger: 'change' }]">
                    <el-select v-model="scope.row.position">
                      <el-option v-for="v in $store.state.distObj.sz_password_job" :key="v.value" :value="v.value"
                        :label="v.label"></el-option>
                    </el-select>
                  </el-form-item>
                  <template v-else>{{ getValueContent($store.state.distObj.sz_password_job, scope.row.position)
                    }}</template>
                </template>
              </el-table-column>
              <el-table-column label="姓名" prop="name">
                <template slot-scope="scope">
                  <el-form-item v-if="isEdit" :prop="`szPwLeaderGroupList.${scope.$index}.name`"
                    :rules="[{ required: true, message: '请选择姓名', trigger: 'change' }]">
                    <el-select v-model="scope.row.name" filterable @change="(val) => {changeUser(val, scope.$index)}">
                      <el-option v-for="v in organUserOptions" :key="v.objuid" :value="v.objuid"
                        :label="v.userName"></el-option>
                    </el-select>
                  </el-form-item>
                  <template v-else>{{ getValueContent(organUserOptions, scope.row.name, { value: 'objuid', label:
                    'userName'}) }}</template>
                </template>
              </el-table-column>
              <el-table-column label="职务" prop="title">
                <template slot-scope="scope">
                  <el-form-item v-if="isEdit" :prop="`szPwLeaderGroupList.${scope.$index}.title`"
                    :rules="[{ required: true, message: '请选择职务', trigger: 'change' }]">
                    <el-select v-model="scope.row.title">
                      <el-option v-for="v in $store.state.distObj.sz_password_position" :key="v.value" :label="v.label"
                        :value="v.value"></el-option>
                    </el-select>
                  </el-form-item>
                  <template v-else>{{ getValueContent($store.state.distObj.sz_password_position, scope.row.title)
                    }}</template>
                </template>
              </el-table-column>
              <el-table-column label="电话" prop="phone"></el-table-column>
              <el-table-column label="职责" prop="responsibility">
                <template slot-scope="scope">
                  <el-form-item v-if="isEdit" :prop="`szPwLeaderGroupList.${scope.$index}.responsibility`"
                    :rules="[{ required: true, message: '请选择职责', trigger: 'change' }]">
                    <el-select v-model="scope.row.responsibility">
                      <el-option v-for="v in $store.state.distObj.sz_common_duty" :key="v.value" :label="v.label"
                        :value="v.value"></el-option>
                    </el-select>
                  </el-form-item>
                  <template v-else>{{ getValueContent($store.state.distObj.sz_common_duty, scope.row.responsibility)
                    }}</template>
                </template>
              </el-table-column>
              <el-table-column label="操作" v-if="isEdit" width="60">
                <template slot-scope="scope">
                  <el-button type="text"
                    @click="deleteLeaderItem(leaderForm.szPwLeaderGroupList, scope.$index)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-card>
        </el-col>
        <el-col :span="7" class="side-upload-box">
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <div>领导小组成立/调整文件</div>
              <el-upload v-if="isEdit" :limit="10" ref="leader-upload" multiple accept=".xlsx, .xls"
                :headers="upload.headers" :action="upload.url" :disabled="upload.isUploading"
                :on-progress="handleFileUploadProgress"
                :on-success="(response, file, fileList) => { handleFileSuccess(response, file, fileList, 'leader') }"
                :on-exceed="(file, list) => { handleExceed(file, list, fileList) }" :show-file-list="false"
                :file-list="fileList" :auto-upload="true"
                :before-upload="(file) => { beforeAvatarUpload(file, fileList) }"
                :on-change="(file, list, fileList) => { onChangeFile(file, list, fileList, 'leader')}">
                <el-button size="mini" type="text" icon="el-icon-upload2">上传文件</el-button>
                <!-- <el-button slot="trigger" size="mini" type="text" icon="el-icon-folder-opened">选取文件</el-button> -->
                <!-- <el-button size="mini" type="text" icon="el-icon-upload2" @click="submitUpload">上传文件</el-button> -->
              </el-upload>
            </div>
            <ul class="file-list" v-if="fileList.length > 0">
              <li v-for="(f, i) in fileList" :key="i">
                <i class="el-icon-document"></i>
                <span class="over" @click="downloadFile(f)">{{ f.name }}</span>
                <template v-if="isEdit"><i @click="deleteFile(fileList, i)" class="el-icon-circle-close"></i><i
                    class="el-icon-circle-check"></i></template>
              </li>
            </ul>
            <template v-else>
              <el-empty v-if="isEdit" :image-size="49" description="选择上传文件"></el-empty>
              <el-empty v-else :image-size="49" description="暂无文件"></el-empty>
            </template>
          </el-card>
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <div>会议制度执行</div>
            </div>
            <el-table :data="meetingList" :key="meetingkey">
              <el-table-column label="类型" width="70" prop="name"></el-table-column>
              <el-table-column label="文件" prop="fileName">
                <template slot-scope="scope">
                  <div class="over-outer">
                    <div class="over" :title="v.fileName" v-for="(v, i) in scope.row.fileList" :key="i">
                      <span @click="downloadFile(v)">{{ v.fileName }}</span>
                      <i @click="deleteFileListItem(meetingList[scope.$index].fileList, i)" v-if="v.fileName && isEdit"
                        class="el-icon-delete"></i>
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="操作" width="50" v-if="isEdit">
                <template slot-scope="scope">
                  <el-upload ref="upload" multiple accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url"
                    :limit="10" :file-list="meetingList[scope.$index].fileList" :disabled="upload.isUploading"
                    :on-progress="handleFileUploadProgress"
                    :on-success="(response, file, fileList) => { handleFileSuccess(response, file, fileList, scope.row, meetingList[scope.$index].fileList) }"
                    :before-upload="(file) => { beforeAvatarUpload(file, meetingList[scope.$index].fileList) }"
                    :on-change="(file, fileList) => { onChangeFile(file, fileList, scope.row) }"
                    :on-exceed="(file, list) => { handleExceed(file, list, meetingList[scope.$index].fileList) }"
                    :show-file-list="false" :auto-upload="true">
                    <el-button size="mini" type="text">上传</el-button>
                  </el-upload>
                </template>
              </el-table-column>
            </el-table>
          </el-card>
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <div>单位保密责任书</div>
              <el-upload v-if="isEdit" :limit="10" ref="upload" multiple accept=".xlsx, .xls" :headers="upload.headers"
                :file-list="passwordFileList" :action="upload.url" :disabled="upload.isUploading"
                :on-progress="handleFileUploadProgress"
                :on-success="(response, file, fileList) => { handleFileSuccess(response, file, fileList, 'password') }"
                :on-change="(file, fileList) => { onChangeFile(file, fileList, 'password')}"
                :before-upload="(file) => { beforeAvatarUpload(file, passwordFileList) }"
                :on-exceed="(file, list) => { handleExceed(file, list, passwordFileList) }" :show-file-list="false"
                :auto-upload="true">
                <el-button size="mini" type="text" icon="el-icon-upload2">上传文件</el-button>
              </el-upload>
            </div>
            <ul class="file-list" v-if="passwordFileList.length > 0">
              <li v-for="(f, i) in passwordFileList" :key="i">
                <i class="el-icon-document"></i>
                <span class="over" @click="downloadFile(f)">{{ f.name }}</span>
                <template v-if="isEdit"><i @click="deleteFile(passwordFileList, i)" class="el-icon-circle-close"></i><i
                    class="el-icon-circle-check"></i></template>
              </li>
            </ul>
            <template v-else>
              <el-empty v-if="isEdit" :image-size="49" description="选择上传文件"></el-empty>
              <el-empty v-else :image-size="49" description="暂无文件"></el-empty>
            </template>
          </el-card>
          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <div>密码工作会议</div>
            </div>
            <el-table :data="passwordMeetingList">
              <el-table-column label="类型" prop="name" width="100"></el-table-column>
              <el-table-column label="文件" prop="fileName">
                <template slot-scope="scope">
                  <div class="over-outer">
                    <div class="over" :title="v.fileName" v-for="(v, i) in scope.row.fileList" :key="i">
                      <span @click="downloadFile(v)">{{ v.fileName }}</span>
                      <i @click="deleteFileListItem(passwordMeetingList[scope.$index].fileList, i)"
                        v-if="v.fileName && isEdit" class="el-icon-delete"></i>
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column label="操作" width="50px" v-if="isEdit">
                <template slot-scope="scope">
                  <el-upload ref="upload" :limit="10" multiple accept=".xlsx, .xls" :headers="upload.headers"
                    :action="upload.url" :disabled="upload.isUploading" :on-progress="handleFileUploadProgress"
                    :file-list="passwordMeetingList[scope.$index].fileList"
                    :on-success="(response, file, fileList) => { handleFileSuccess(response, file, fileList, scope.row) }"
                    :before-upload="(file) => { beforeAvatarUpload(file, passwordMeetingList[scope.$index].fileList) }"
                    :on-exceed="(file, list) => { handleExceed(file, list, passwordMeetingList[scope.$index].fileList) }"
                    :show-file-list="false" :auto-upload="true">
                    <el-button size="mini" type="text">上传</el-button>
                  </el-upload>
                </template>
              </el-table-column>
            </el-table>
          </el-card>
        </el-col>
      </el-row>
    </el-form>

    <el-dialog :visible.sync="batcLineDownVisibile" title="提示" width="500px">
      <el-form :model="batcLineForm" label-width="200" ref="batc-line-form">
        <el-form-item label="请选择下载文件年份" prop="year"
          :rules="[{ required: true, message: '请选择下载年费', trigger: 'change' }]">
          <el-select v-model="batcLineForm.year">
            <el-option v-for="v in yearOptions" :key="v" :value="v" :label="v"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="batcLineDownVisibile = false">取 消</el-button>
        <el-button type="primary" @click="batcLineDownload">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import { organGetUser, timeLine, groupBatch, organDeptTree, timeLineId } from '@/api/cadre/leader'
import { getToken } from "@/utils/auth"
import { getDistContent, deepClone } from "@/utils/index"
export default {
  name: 'cadre-leader',
  data() {
    return {
      orgId: '1721424754840653825',
      policeOptions: [
        { id: '1721424754840653825', label: '台州市'}
      ],
      leaderForm: {
        szLeaderGroupList: [],
        szPwLeaderGroupList: [],
        subDepartment: [],
        subDepartmentName: ''
      },
      isEdit: false,
      passwordOptions: [],
      fileList: [],
      meetingList: [
        { name: '会议通知', fileType: 1, fileName: '', fileContent: '', fileList: [] },
        { name: '会议纪要', fileType: 2, fileName: '', fileContent: '', fileList: [] },
        { name: '党委汇报', fileType: 3, fileName: '', fileContent: '', fileList: [] }
      ],
      passwordFileList: [],
      passwordMeetingList: [
        { name: '会议通知', fileType: 5, fileName: '', fileContent: '', fileList: [] },
        { name: '会议开展情况', fileType: 6, fileName: '', fileContent: '', fileList: [] }
      ],
      organUserOptions: [],
      // +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
      upload: {
        // 是否禁用上传
        isUploading: false,
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + "/sz/line/upload"
      },
      activities: [],
      timeType: '',
      timeId: '',
      batcLineDownVisibile: false,
      batcLineForm: {
        year: ''
      },
      yearOptions: [],
      originalSzLeaderGroupList: [],
      originalSzPwLeaderGroupList: [],
      loading: false,
      meetingkey: ''
    }
  },
  created() {
    // console.log('store:', this.$store.state)
    // console.log(this.$download.resource)
    this.$store.state.orgId = '1721424754840653825'
    this.organGetUser()
    this.timeLine()
    this.organDeptTree()
  },
  methods: {
    getArrayValue(list, val, num, arr) {
      for (let v of list) {
        if (v.children && v.children.length > 0) {
          arr[num] = v.orgId
          return this.getArrayValue(v.children, val, 1, arr)
        }
        if (v.orgId === val) {
          arr[num] = v.orgId
          return arr
        }
      }
    },
    // passwordChange(val){
    //   console.log('val:', val)
    // },
    getValueContent(list, val, prop) {
      return getDistContent(list, val, prop)
    },
    // 取消编辑
    cancelEdit() {
      this.isEdit = false
      this.timeLineId()
    },
    // 获取成员列表
    organGetUser() {
      organGetUser({orgId: this.orgId,groupType: '0'}).then(res => {
        if (res.code === 200) {
          this.organUserOptions = res.data
        }
      })
    },
    // 获取时间轨迹
    timeLine() {
      let params = {
        pageSize: 200
      }
      timeLine(params).then(res => {
        if (res.code === 200) {
          this.activities = res.rows.map(v => {
            let year = v.submissionTime.slice(0,4)
            if (!this.yearOptions.includes(year)) {
              this.yearOptions.push(year)
            }
            v.content = '更新'
            if (v.timeType === '0') {
              this.timeType = '0'
              this.timeId = v.timeId
              this.timeLineId()
              v.content = '最新'
              v.type = 'primary'
            }
            return v
          })
        }
      })
    },
    // 获取时间线详情
    timeLineId() {
      timeLineId(this.timeId).then(res => {
        if (res.code === 200) {
          this.leaderForm.szLeaderGroupList = []
          this.leaderForm.szPwLeaderGroupList = []
          this.originalSzLeaderGroupList = []
          this.originalSzPwLeaderGroupList = []
          res.data.szLeaderGroupList && res.data.szLeaderGroupList.forEach(v => {
            if (v.groupType === '0') {
              this.leaderForm.szLeaderGroupList.push(v)
            } else {
              this.leaderForm.szPwLeaderGroupList.push(v)
              this.leaderForm.subDepartmentName = v.subDeptName
              let arr = []
              this.leaderForm.subDepartment = this.getArrayValue(this.$store.state.passwordOptions, v.subDepartment, 0, arr)
            }
          })
          this.originalSzLeaderGroupList = deepClone(this.leaderForm.szLeaderGroupList)
          this.originalSzPwLeaderGroupList = deepClone(this.leaderForm.szPwLeaderGroupList)

          this.fileList = []
          this.passwordFileList = []
          this.meetingList.forEach(v => {
            v.fileList = []
          })
          this.passwordMeetingList.forEach(v => {
            v.fileList = []
          })
          res.data.szTimeFileList && res.data.szTimeFileList.forEach(v => {
            switch(v.fileType) {
              case '0':
                if (v.fileName) {
                  v.name = v.fileName
                  this.fileList.push(v)
                }
                break
              case '1':
              case '2':
              case '3':
                if (v.fileName) {
                  this.meetingList[v.fileType - 1].fileList.push(
                    {
                      fileName: v.fileName,
                      fileContent: v.fileContent
                    }
                  )
                }
                break
              case '4':
                if (v.fileName) {
                  v.name = v.fileName
                  this.passwordFileList.push(v)
                }
                break
              case '5':
              case '6':
                if (v.fileName) {
                  this.passwordMeetingList[v.fileType - 5].fileList.push(
                    {
                      fileName: v.fileName,
                      fileContent: v.fileContent
                    }
                  )
                }
                break
            }
          })
          // console.log('this.meetingList:', this.meetingList)
        }
      })
    },
    // 选择时间线
    changeTimeItem(val, index) {
      this.activities.map(v => {
        if (v.type === 'primary') {
          v.type = ''
        }
        return v
      })
      this.activities[index].type = 'primary'
      this.timeType = val.timeType
      this.showEdit = false
      this.isEdit = false
      this.timeId= val.timeId
      this.timeLineId()
    },
    // 获取机构树
    organDeptTree() {
      let params = {
        objuid: this.orgId
        // pid: 0
      }
      organDeptTree(params).then(res => {
        if (res.code === 200) {
          this.$store.state.passwordOptions = res.data
          // this.passwordOptions = res.data
        }
      })
    },
    // 文件上传
    handleExceed(files, list, fileList) {
      // this.$message.warning(`当前限制选择 10 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
      this.$message.warning('最多可上传10个文件')
    },
    // 上传前
    beforeAvatarUpload(file, fileList) {
      // if (fileList.length >= 10) {
      //   this.$message.error('已成功上传10个文件，继续上传新文件将会按照顺序逐个替换最早上传的文件')
      // }
    },
    deleteFile(fileList, index) {
      // this.$confirm(`确定移除 ${ fileList[index].name }？`, '提示', {
      //   confirmButtonText: '确定',
      //   cancelButtonText: '取消',
      //   type: 'warning'
      // }).then(() => {
        fileList.splice(index, 1)
      //   this.$message({
      //     type: 'success',
      //     message: '删除成功!'
      //   });
      // }).catch(() => {})
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true
    },
    onChangeFile(file, list, fileList, type) {
      // console.log(file, list)
      // if (this.fileList.length > 2) {
      //   this.upload.isUploading = true
      // }
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList, type, olist) {
      this.upload.isUploading = false;
      if (type === 'password') {
        // this.passwordFileList = [...this.passwordFileList,...fileList]
        // this.passwordFileList.push(file)
        // this.passwordFileList = this.passwordFileList.splice(-10)
        this.passwordFileList = fileList
        return
      } else if(type === 'leader') {
        // this.fileList = this.DedArray([...this.fileList,...fileList])
        this.fileList = fileList
        // this.fileList = this.fileList.splice(-10)
        return
      } else {
        switch (type.fileType) {
          case 1:
          case 2:
          case 3:
            fileList = fileList.map(v => {
              v.fileName = v.fileName || v.response.newFileName
              v.fileContent = v.fileContent || v.response.fileName
              return v
            })
            this.meetingList[type.fileType - 1].fileList = fileList
            break
          case 5:
          case 6:
            fileList = fileList.map(v => {
              v.fileName = v.fileName || v.response.newFileName
              v.fileContent = v.fileContent || v.response.fileName
              return v
            })
            this.passwordMeetingList[type.fileType - 5].fileList = fileList
            break
        }
      }
      // fileList = []
      this.$message.success('上传成功')
    },
    // 选择用户获取电话号码
    changeUser(val, index) {
      for (let v of this.organUserOptions) {
        if (v.objuid === val) {
          this.leaderForm.szPwLeaderGroupList[index].phone = v.userTel || '-'
          this.$set(this.leaderForm.szPwLeaderGroupList, index, this.leaderForm.szPwLeaderGroupList[index])
          return
        }
      }
    },
    // 删除领导小组人员
    deleteLeaderItem(list, index) {
      list.splice(index, 1)
    },
    // 增加领导小组人员
    addLeaderItem(type) {
      if (type === 'leader') {
        this.leaderForm.szLeaderGroupList.push({ position: '', name: '', title: '' })
      } else {
        this.leaderForm.szPwLeaderGroupList.push({ position: '', name: '', title: '', responsibility: '', phone: '', department: '', subDepartment: '' })
      }
    },
    deleteFileListItem(list, index) {
      // this.$set(list, )
      list.splice(index, 1)
      // list[index].fileName = ''
      // list[index].fileContent = ''
    },
    downloadFile(file) {
      this.$download.resource(file.fileContent)
    },
    // 批量下载
    batcLineDownload(){
      this.$refs['batc-line-form'].validate((valid) => {
        if (valid) {
          this.$download.zip(`/sz/line/download?year=${this.batcLineForm.year}`, `${this.batcLineForm.year}-领导小组`)
          this.batcLineDownVisibile = false
        } else {
          return false
        }
      })
    },
    verifyUser(oriList, list) {
      if (list.length !== oriList.length) {
        return false
      }
      for (let n in oriList) {
        if (oriList[n].name !== list[n].name) {
          return false
        }
      }
      return true
    },
    // submitUpload(){
    //   this.$refs['leader-upload'].submit()
    // },
    // 提交表单
    submitForm() {
      // "groupType": 0, 小组里加个区分，小组类型（0=领导小组，1=密法办）
      // console.log('this.leaderForm.szLeaderGroupList:', this.leaderForm.szLeaderGroupList)
      this.$refs['leader-ref-form'].validate((valid) => {
        if (valid) {
          // alert('submit!');
          let data = {
            szLeaderGroupList: [],
            szTimeFileList: [],
            timeId: this.timeId
          }
          // 领导小组
          this.leaderForm.szLeaderGroupList.forEach(v => {
            v.groupType = 0
            data.szLeaderGroupList.push(v)
          })
          // 保密办
          this.leaderForm.szPwLeaderGroupList.forEach(v => {
            v.groupType = 1
            v.subDepartment = this.leaderForm.subDepartment[this.leaderForm.subDepartment.length - 1]
            data.szLeaderGroupList.push(v)
          })
          // 领导小组成立/调整文件
          this.fileList.forEach(v => {
            let file = {
              fileName: v.response ? v.response.newFileName : v.fileName,
              fileContent: v.response ? v.response.fileName : v.fileContent,
              fileType: 0
            }
            data.szTimeFileList.push(file)
          })
          // 会议制度
          this.meetingList.forEach(v => {
            v.fileList.forEach(x => {
              let item = {...x}
              item.fileType = v.fileType
              data.szTimeFileList.push(item)
            })
          })
          // 单位保密责任书
          this.passwordFileList.forEach(v => {
            data.szTimeFileList.push({
              fileName: v.response ? v.response.newFileName : v.fileName, 
              fileContent: v.response ? v.response.fileName : v.fileContent,
              fileType: 4
            })
          })
          // 密码工作会议
          this.passwordMeetingList.forEach(v => {
            v.fileList.forEach(x => {
              let item = { ...x }
              item.fileType = v.fileType
              data.szTimeFileList.push(item)
            })
          })
          // console.log(data.szTimeFileList, this.passwordMeetingList, this.passwordFileList, this.meetingList, this.fileList)
          // return
          if (!this.verifyUser(this.originalSzLeaderGroupList, this.leaderForm.szLeaderGroupList) || !this.verifyUser(this.originalSzPwLeaderGroupList, this.leaderForm.szPwLeaderGroupList)) {
            this.$confirm('人员发生变化，提交将更新时间轴', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              this.loading = true
              groupBatch(data).then(res => {
                if (res.code === 200) {
                  this.$message.success(res.msg)
                  this.isEdit = false
                  this.timeLine()
                  this.loading = false
                } else {
                  this.$message.error(res.msg)
                }
              })
            }).catch(() => {})
            return false
          }
          this.loading = true
          groupBatch(data).then(res => {
            if (res.code === 200) {
              this.$message.success(res.msg)
              this.isEdit = false
              this.timeLine()
              this.loading = false
            } else {
              this.$message.error(res.msg)
            }
          })
        } else {
          console.log('error submit!!');
          return false;
        }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.cadre-com-leader-box{
  .page-header{
    display: flex;
    margin-bottom: 20px;
    .select-box{
      flex: 1;
    }
    .el-dropdown{
      margin-right: 10px;
    }
  }
  .con-box{
    .el-card{
      margin-bottom: 20px;
      .el-card__header{
        line-height: 28px;
        height: 50px;
      }
      .file-list{
        height: 93px;
        overflow-y: auto;
        li {
          color: #606266;
          margin-top: 5px;
          border-radius: 4px;
          line-height: 26px;
          transition: .5s;
          padding: 0 6px;
          cursor: pointer;
          display: flex;
          align-items: center;
          span{
            flex: 1;
            padding: 0 4px;
          }
          .over{
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            color: #409eff;
          }
          .el-icon-circle-check{
            color: #67c23a;
          }
          .el-icon-circle-close{
            color: #f56c6c;
            display: none;
          }
        }
        li:hover{
          background: #F5F7FA;
          .el-icon-circle-close{
            display: block;
          }
          .el-icon-circle-check{
            display: none;
          }
        }
      }
    }
  }
  .time-line-box{
    min-width: 200px;
    min-height: 200px;
    .el-timeline{
      margin-left: 4px;
    }
  }
  .side-upload-box{
    .clearfix{
      display: flex;
      div:first-child{
        flex: 1;
      }
    }
    .el-table{
      .over-outer{
        max-height: 60px;
        overflow-y: auto
      }
      .over{
        display: flex;
        line-height: 1.6;
        align-items: center;
        span {
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          flex: 1;
          color: #409eff;
        }
        i{
          cursor: pointer;
        }
      }
    }
    .el-empty{
      padding: 0;
    }
  }
  .content-list-box{
    .el-form-item{
      margin-bottom: 0;
    }
    .is-error{
      margin-bottom: 14px;
    }
  }
}
</style>
<style lang="scss">
.cadre-com-leader-box{
  .el-card{
    .el-card__header{
      line-height: 28px;
      .el-button--mini{
        padding: 6px 15px;
      }
    }
  }
  .content-list-box{
    .el-table td.el-table__cell div{
      min-height: 32px;
    }
  }
  .side-upload-box{
    .el-table--small .el-table__cell{
      padding: 2px 0;
    }
    .el-table td.el-table__cell div{
      line-height: 32px;
    }
  }
}
</style>